<template>
  <el-row class="boxrow">
    <el-col :span="20">
      <i class="el-icon-s-home myicon" />
      <span class="fw">{{ item.name }}</span>
    </el-col>
    <el-col :span="4">
      <el-row class="myrow">
        <el-col>{{ item.manager }}</el-col>
        <el-col>
          <el-dropdown @command="handleCommand">
            <span class="el-dropdown-link">
              操作<i class="el-icon-arrow-down el-icon--right" />
            </span>
            <el-dropdown-menu slot="dropdown">
              <el-dropdown-item command="add">添加子部门</el-dropdown-item>
              <el-dropdown-item
                v-if="!item.isTop"
                command="check"
              >查看部门</el-dropdown-item>
              <el-dropdown-item
                v-if="!item.isTop"
                command="del"
              >删除部门</el-dropdown-item>
            </el-dropdown-menu>
          </el-dropdown>
        </el-col>
      </el-row>
    </el-col>
  </el-row>
</template>

<script>
import { delDepartments } from '../../../api/departments'
export default {
  /* eslint-disable */
  props: {
    item: {
      type: Object
    }
  },
  /* eslint-disable */
  methods: {
    async handleCommand(command) {
      switch (command) {
        case 'add':
          // console.log(1)
          this.$emit('openadd', this.item)
          break
        case 'check':
          // console.log(1)
          this.$emit('openedit', this.item)
          break
        case 'del':
          try {
            await this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
              confirmButtonText: '确定',
              cancelButtonText: '取消',
              type: 'warning'
            })
            await delDepartments(this.item.id)
            this.$emit('refData')
            this.$message('删除部门成功')
          } catch (err) {
            console.log(err)
            // console.log(3)
          }

          // this.$emit('delete')

          break
      }
    }
  }
}
</script>

<style lang="scss" scopend>
.boxrow {
  width: 100%;
  font-size: 14px;
  .myicon {
    margin-right: 6px;
  }
  .fw {
    font-weight: 700;
  }
  .myrow {
    display: flex;
  }
  v::deep .el-col {
    text-align: right;
  }
}
</style>
